<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <script>
        // JavaScript是 函数级作用域 编程语言：变量只在其定义时所在的function内部有意义。
        
        // function fun() {
        //     var a = 10;
        // }
        // fun();
        // console.log(a); // 报错 
        // 变量a是在fun函数中被定义的，所以变量a只在fun函数内部有定义，fun函数就是a的“作用域”，变量a被称为局部变量
        

        // 如果不将变量定义在任何函数的内部，此时这个变量就是全局变量，他在任何函数内都可以被访问和更改。
         
        // var a = 10;
        // function fun() {
        //     a++;
        //     console.log(a);     // 输出11
        // }
        // fun();
        // console.log(a);         // 输出11
        // 变量a没有定义在任何函数内部，它是“全局变量”
        

        // 如果函数中也定义了和全局同名的变量，则函数内的变量会将全局的变量“遮蔽“
         
        // var a = 10;
        // function fun() {
        //     // 局部变量a将全局变量a“遮蔽”了
        //     var a = 5;
        //     a++;
        //     console.log(a);    // 输出6
        // }
        // fun();
        // console.log(a);        // 输出10


        // 注意考虑变量声明提升的情况  变量声明提升只提升定义不提升值
        var a = 1;
        function fun() {
            a++;                // 局部变量a被自增1，a此时是undefined，自增1结果是NaN
            var a = 4;          // 此变量声明将会提升至a++之前，并且重新将a赋值为4
            console.log(a);     // 输出4
        }
        fun();
        console.log(a);         // 输出1


        // 形参也是局部变量
        // var a = 10;
        // function fun(a) {           // 形参也是函数内部的局部变量
        //     a++;
        //     console.log(a);         // 输出8
        // }
        // fun(7);
        // console.log(a);             // 输出10
        


    </script>
</body>

</html>